<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<div id="main" style="width: 100%;height: 300px;"></div>
	</body>
	<script src="js/echarts.js"></script>
	<script src="js/vue.js"></script>
	<script src="js/jquery1.42.min.js"></script>
	<script>
		var myChart = echarts.init(document.getElementById('main'));
		option = {
  legend: {
    data: ['可控', '不可控']
  },
  dataZoom:{
    left: "92%",
    show: true,
    yAxisIndex: 0,
  },
  xAxis: {
    type: 'value'
  },
  yAxis: {
    type: 'category',
    triggerEvent: "true",
    data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
  },
  series: [
    {
      name: '可控',
      type: 'bar',
      stack: '总量',
      data: [0, 302, 301, 0, 390, 0, 0]
    },
    {
      name: '不可控',
      type: 'bar',
      stack: '总量',
      data: [120, 0, 0, 134, 0, 230, 210]
    },
    {
      type: "line",
      name: "当前选择",
      markLine: {
        silent: true,
        data: [
          {
            yAxis: '周日'
          }
        ]
      }
    },
  ]
};
myChart.setOption(option);
	</script>
</html>
